<link rel="stylesheet" href="__PUBLIC__/Mobile/css/play.css">
<link rel="stylesheet" href="__PUBLIC__/Mobile/css/zy.media.min.css">

<header class="topBar">
    <a href="{:U('List/categroyVideos',['cid'=>$cid])}">
        <i class="iconfont icon-jiantou1"></i>
        <h2>{$videosInfo.name}</h2>
    </a>
    <if condition="($isLike eq 0) ">
        <i class="unlike iconfont icon-shoucangcang" id="collect"></i>
     <else />
        <i class="unlike iconfont icon-shoucangcang liked" id="collect"></i>
    </if>
</header>
<!--播放器-->
    <div class="zy_media">
        <video poster="__ROOT__/{$videosInfo['cover']}" data-config='{"mediaTitle": "<?php echo $videosItemInfo[$vItemid]['name'] ?>"}'>
            <source src="__ROOT__/{$videosItemInfo[$vItemid].addr}" type="video/mp4">
            <source src="__ROOT__/{$videosItemInfo[$vItemid].addr}" type="video/wmv">
        </video>
    </div>

    <!--详情-->
    <div class="weui_tab">
        <div class="weui_navbar">
            <a href="#tab1" class="weui_navbar_item weui_bar_item_on">
                章节
            </a>
            <a href="#tab2" class="weui_navbar_item">
                详情
            </a>
        </div>
        <div class="weui_tab_bd">
            <div id="tab1" class="weui_tab_bd_item weui_tab_bd_item_active">
                <div class="chapter">
                    <ul>
                        <php>
                            $i=1;
                        </php>
                        <foreach name='videosItemInfo' item='vo'>
                            <if condition="$vo.id eq $vItemid">
                                    <li>
                                        <a class="current_play" href="{:U('Play/getVideosItem',['vid'=>$videosInfo['id'],'vitemid'=>$vo['id']])}">
                                            <span>{$i++}</span>
                                            <span class="chapter_name ">{$vo.name}</span>
                                            <span class="chapter_time ">{$vo.timelength}</span>
                                        </a>
                                    </li>
                                <else/>
                                    <li>
                                        <a href="{:U('Play/getVideosItem',['vid'=>$videosInfo['id'],'vitemid'=>$vo['id']])}">
                                            <span>{$i++}</span>
                                            <span class="chapter_name">{$vo.name}</span>
                                            <span class="chapter_time">{$vo.timelength}</span>
                                        </a>
                                    </li>
                            </if>
                            
                        </foreach> 
                    </ul>
                </div>
            </div>
            <div id="tab2" class="weui_tab_bd_item">
                <div class="detail">
                    <h3>{$videosInfo.name}</h3>
                    <p class="author">来自：{$videosInfo.vres}</p>
                    <p class="describe">
                        {$videosInfo.intro}
                    </p>
                    <span class="upload_time">上传时间:{$videosInfo.ctime}</span>
                </div>
                <!--相关推荐-->
                <div class="weui_panel weui_panel_access">
                    <div class="weui_panel_hd">相关推荐</div>
                    <div class="weui_panel_bd">
                        <foreach name='getRelaVideos' item='vo'>
                            <a href="{:U('Play/getVideosItem',['vid'=>$vo['id'] ])}" class="weui_media_box weui_media_appmsg">
                                <div class="weui_media_hd">
                                    <img class="weui_media_appmsg_thumb" src="__ROOT__/{$vo.cover}" alt="木有图片咋办">
                                </div>
                                <div class="weui_media_bd">
                                    <h4 class="weui_media_title">{$vo.name}</h4>
                                    <p class="weui_media_desc">{$vo.intro}</p>
                                </div>
                            </a>
                        </foreach>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    
<script type="text/javascript" src="__PUBLIC__/Mobile/js/zy.media.min.js"charset="utf-8"></script>
<script>
    var vid = {$videosInfo.id};
    (function ($){
        $(function(){
            //播放器
            zymedia('video');
        })
        //喜欢
        $("#collect").click(function (){
            var option;
            if( $("#collect").hasClass('liked') ){
                option = 0;
            }else{
                option = 1;
            }
            $.getJSON("{:U('Play/likeVideo')}",{'option':option,'vid': vid },function (data){
                
                if(data && data.status<0){
                    window.location = "{:U('Passport/index')}";
                }
            });
            $("#collect").toggleClass('liked');
        });
    })(jQuery)
</script>
